{% extends 'BASE/base.html' %}
{% block css %}
{% load static %}
<link rel="stylesheet" type="text/css" href="{% static 'css/Index/index.css' %}"/>
<link rel="stylesheet" type="text/css" href="{% static '/css/Comic/comic.css' %}"/>
{% endblock %}
{% block js %}
<script src="{% static 'js/Comic/comic.js' %}" type="text/javascript" charset="utf-8"></script>
{% endblock %}
{% block title %} 小说-书漫网O(∩_∩)O哈哈~ {% endblock %}
{% block main %}
<div class="container" id="novels">
    <div class="row">
        <div id="tab" class="col-10">
            <ul class="nav mb-3" id="pills-tab" role="tablist">
                <li class="nav-item" id="read">
                    <a class="nav-link active" id="novels_read_rank-tab" data-toggle="pill" href="#novels_read_rank"
                       role="tab"
                       aria-controls="novels_rank" aria-selected="true">阅读量<span
                            class="zi zi_forDown opacity"></span></a>
                </li>
                <li class="nav-item" id="collection">
                    <a class="nav-link" id="novels_collection_rank-tab" data-toggle="pill"
                       href="#novels_collection_rank" role="tab"
                       aria-controls="novels_collection_rank" aria-selected="false">收藏量<span
                            class="zi zi_forDown opacity"></span></a>
                </li>
                <li class="nav-item" id="update">
                    <a class="nav-link" id="novels_update_rank-tab" data-toggle="pill" href="#novels_update_rank"
                       role="tab"
                       aria-controls="novels_update_rank" aria-selected="true">更新时间<span
                            class="zi zi_forDown opacity"></span></a>
                </li>
            </ul>
        </div>
    </div>
    <div class="row">
        <div class="tab-content col-10 " id="pills-tabContent">
            {#阅读量#}
            <div class="tab-pane fade show active" id="novels_read_rank" role="tabpanel"
                 aria-labelledby="novels_read_rank-tab">
                {% include 'Novels/__read.html' %}
            </div>
            {#收藏量#}
            <div class="tab-pane fade" id="novels_collection_rank" role="tabpanel"
                 aria-labelledby="novels_collection_rank-tab">
                {% include 'Novels/__collection.html' %}
            </div>
            {#更新时间#}
            <div class="tab-pane fade" id="novels_update_rank" role="tabpanel" aria-labelledby="novels_update_rank-tab">
                {% include 'Novels/__update.html' %}
            </div>
        </div>
    </div>

</div>
{% endblock %}
